@import "mixins/mixins";
@import "common/var";
@import "_main";

@include b(cod) {
  @include e(header) {
    display: flex;
    height: 98px;
    width: 100%;
    background: #f38218;
  }

  @include e(bg) {
    background: #f5f5f5;
  }

  @include e(noaddress) {
    display: flex;
    align-items: center;
    padding-left: 15px;
    font-size: 16px;
    color: #fff;
    line-height: 20px;
    font-weight: 600;

    & image {
      margin-left: 5px;
      height: 13px;
      width: 13px;
    }
  }

  @include e(address) {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    & .left {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding-left: 15px;
      font-size: 16px;
      color: #fff;
    }

    & .right {
      display: flex;
      align-items: center;
      margin-right: 10px;
      & image {
        margin-left: 5px;
        height: 13px;
        width: 13px;
      }
    }

    & .topline {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      font-size: 20PX;
      font-weight: 600;
      div:nth-child(2) {
        margin-left: 5px;
      }
    }

    & .bottomline {
      font-size: 16PX;
    }
  }

  @include e(form) {
    background: #f38218;
    & .cell-group {
      background: #fff;
      border-top-left-radius: 13px;
      border-top-right-radius: 13px;
    }
    & .cell-product {
      display: flex;
      align-items: center;
      font-size: 15PX;
      color: #212121;
      height: 80px;
      border-bottom: 1rpx solid #e0e0e0;

      & .right {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex: 0 0 80%;
        margin-left: 10px;
      }

      & .icon {
        display: flex;
        align-items: center;
        margin-left: 13px;
      }

      & .icon image {
        width: 50px;
        height: 32px;
      }

      & .product-info {
        & .sku {
          color: #959595;
          font-size: 13PX;
        }
      }

      & .price-info {
        margin-right: 10px;
        & .price span {
          font-size: 10PX;
        }

        & .num {
          font-size: 12px;
          color: #afafaf;
        }
      }
    }

    & .cell {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      height: 46px;
      border-bottom: 1rpx solid #e0e0e0;
      & div:nth-child(1) {
        margin-left: 15px;
      }
      & div:nth-child(2) {
        margin-right: 15px;
      }
    }

    & .cell-freight {
      font-size: 15PX;
      color: #212121;

    }

    & .cell-price {
      font-size: 15PX;
      color: #ff6b00;
      & div span {
        font-size: 10px;
      }
    }
  }

  @include e(footer) {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    width: 100%;
    background: #fff;
    border-top: 1rpx solid #e0e0e0;

    display: flex;
    align-items: center;
    justify-content: space-between;

    & .left {
      display: flex;
      align-items: center;
      font-size: 18PX;
      color: #212121;
      margin-left: 15px;

      & .price {
        color: #ff6b00;
        & span {
          font-size: 10px;
        }
      }
    }

    & .right {
      margin-right: 15px;
     &  button {
       width: 112px;
       height: 40px;
       background: #ff6b00;
       font-size: 15px;
       line-height: 40px;
       color: #fff;
       border-radius: 20px;
     }
    }
  }
}
